import React, { useState, useEffect } from 'react'
import { Pagination } from "antd"
import { getMyAnswer } from "../../api/ask"
import Item from "./MyAnswerItem"
import "./MyAnswer.scss"
export default function MyAnswer() {
    const [sendParams, setSendParams] = useState({
        pageNum: 1,
        pageSize: 10,
        questionTitle: "",
    })
    // 获取列表的参数
    const [pageTotal, setPageTotal] = useState(0)
    // 分页的总数量
    const [list, setList] = useState([])
    // 总数据的列表
    const [flag,setFlag] = useState(false)
    const onChange = (pageNumber) => {
        setSendParams({ ...sendParams, pageNum: pageNumber })
    }
    // 获取分页的页码
    const getAnswerList = async () => {
        let res = await getMyAnswer(sendParams)
        setList(res.data.rows);
        console.log(res.data.rows);
        setPageTotal(res.data.total)
    }
    // 重新获取的数据列表
    useEffect(() => {
        getAnswerList()
    }, [sendParams,flag])
    // 当参数发生改变的时候调用列表
    const init = () => {
        setFlag(!flag)
    }
    return (
        <div className="ask_right_big">
            <div className="ask_right_big_-top">
                <input placeholder="搜索" value={sendParams.questionTitle} onChange={(e) => {
                    setSendParams({ ...sendParams, questionTitle: e.target.value })
                }} />
            </div>
            <div className="ask_right_big-bottom">
                {
                    list && list.map(item => {
                        return <Item init={init} item={item}/> 
                    })
                }
            </div>
            <div>
                <Pagination defaultCurrent={2} total={pageTotal} onChange={onChange} />
            </div>
        </div>
    )
}
